---
import BaseHead from '../../components/BaseHead.astro';
import Header from '../../components/Header.astro';
import Footer from '../../components/Footer.astro';
import Counter from '../../components/Counter.svelte';
import HTML from '../../layouts/HTML.astro';
import * as m from "../../paraglide/messages.js";
---

<HTML>
	<head>
		<BaseHead title={m.site_title()} description={m.site_description()} />
	</head>
	<body>
		<Header title={m.site_title()} />
		<main>
			<h1>🧑‍🚀 Hallo Astronaut</h1>
			<p>
				Dieses Beispiel soll Ihnen helfen, Paraglide in Ihre Multi-Language
				Astro-App zu integrieren. Paraglide ist eine großartige Ergänzung für die interaktiven Inseln
				in Ihrer App, wie Formulare, App-Shells oder dieser Zähler:
			</p>
			<Counter client:load />
			<p>
				Weil Paraglide sehr gut treeshaket, versendet jede Insel nur die Nachricht, die sie tatsächlich verwendet.
				Dies bedeutet, dass Sie Paraglide in Ihrer App verwenden können, ohne sich um die Größe Ihres JS-Bundles zu kümmern.
				Es kann nur 100 Bytes gross werden!
			</p>

			<p>
				Schauen Sie sich dieses Beispiel also gerne an und sehen Sie, wie Paraglide Ihnen helfen kann,
				oder lesen Sie <a href="https://inlang.com/g/utqgkmzp/guide-lorissigrist-buildAGlobalAstroApp">die geschriebene Anleitung auf der Paraglide-Website.</a>
			</p>
		</main>
		<Footer />
	</body>
</HTML>
